<template>
  <div class="outer">
    <h1>App</h1>
    {{list}}
    <button @click='destroyApp'>卸载App组件</button>
    <List ref='listComp'/>
  </div>
</template>

<script>
import _ from 'lodash';
import List from './components/List'
export default {
  name : 'App',
  data () {
    return {
      list : []
    }
  },
  mounted() {
    this.$refs.listComp.$on('atguigu', this.getListData)
  },
  components : {
    List,
  },
  methods : {
    getListData(list){
      this.list = _.cloneDeep(list);


    }
  }
 
}
</script>

<style scoped>
.outer {
  height: 400px;
  background: yellowgreen;
}
</style>